<template>
    <div class="quoView">
      <!--视图-->
      <el-row>
        <el-col :span="20" :offset="2" style="color: #333333">
          <el-row class="m-b-10">
            <el-col :offset="2" :span="4">
              <div style="line-height: 56px;font-size: 18px;width:200px">审批过程：</div>
            </el-col>
            <!--同意显示同意-->
            <el-col v-if="this.quotation.quotationAppStatus !== 3" :span="18">
              <el-steps :active="active" finish-status="success" space="20%">
                <el-step title="待申请"></el-step>
                <el-step title="待审批"></el-step>
                <el-step title="同意"></el-step>
                <el-step title="执行"></el-step>
              </el-steps>
            </el-col>
            <!--否决显示否决-->
            <el-col v-if="this.quotation.quotationAppStatus === 3" :span="18">
              <el-steps :active="active" finish-status="success" space="20%">
                <el-step title="待申请"></el-step>
                <el-step title="待审批"></el-step>
                <el-step title="否决"></el-step>
                <el-step title="执行"></el-step>
              </el-steps>
            </el-col>
          </el-row>
          <el-row class="m-b-20">
            <el-row v-if="this.quotation.quotationAppStatus === 0">
              <el-col  :offset="8" :span="4" >
                <div class="opera" @click="findAllEmp(currPage,pageSize)">
                  <div style="line-height: 30px;"><i class="el-icon-position"/></div>
                  <span class="font-14">申请审批</span>
                </div>
              </el-col>
              <el-col  :span="4" >
                <div class="opera-no">
                  <div style="line-height: 30px;"><i class="el-icon-d-arrow-left"/></div>
                  <span class="font-14">撤销审批</span>
                </div>
              </el-col>
            </el-row>
            <el-row v-if="this.quotation.quotationAppStatus === 1">
              <el-col  :offset="8" :span="4" >
                <div class="opera-no">
                  <div style="line-height: 30px;"><i class="el-icon-position"/></div>
                  <span class="font-14">申请审批</span>
                </div>
              </el-col>
              <el-col  :span="4" >
                <div class="opera" @click="repealApp">
                  <div style="line-height: 30px;"><i class="el-icon-d-arrow-left"/></div>
                  <span class="font-14">撤销审批</span>
                </div>
              </el-col>
            </el-row>
            <el-row v-if="this.quotation.quotationAppStatus === 3">
              <el-col  :offset="8" :span="4" >
                <div class="opera" @click="findAllEmp(currPage,pageSize)">
                  <div style="line-height: 30px;"><i class="el-icon-position"/></div>
                  <span class="font-14">申请审批</span>
                </div>
              </el-col>
              <el-col  :span="4" >
                <div class="opera-no">
                  <div style="line-height: 30px;"><i class="el-icon-d-arrow-left"/></div>
                  <span class="font-14">撤销审批</span>
                </div>
              </el-col>
            </el-row>
            <!-- 员工表格dialog-->
            <el-dialog width="30%" title="申请审批" :visible.sync="innerDialog">
              <div style="margin-bottom: 20px"><span class="font-14-bold">说明：</span>以下人员拥有审批权限</div>
              <el-table :data="empList" style="width: 100%">
                <el-table-column prop="job.jobName" label="员工职位" >
                </el-table-column>
                <el-table-column prop="empName" label="员工姓名" >
                </el-table-column>
              </el-table>
              <el-row style="margin-top:10px">
                <el-col :span="16">
                  <el-pagination layout="prev, pager, next, jumper" :total="totalSize" @current-change="changePage"
                                 :current-page.sync="currPage" :page-size="pageSize"></el-pagination>
                </el-col>
              </el-row>
              <div style="margin-top: 20px;text-align: center">
                <el-button @click="saveApproval">申请审批</el-button>
              </div>
              <!--<el-checkbox-group v-model="checkedCities" @change="handleCheckedCitiesChange">
                <el-checkbox v-for="emp in empList" :label="emp.empName" :key="emp.empName">{{emp.empName}}</el-checkbox>
              </el-checkbox-group>-->
            </el-dialog>
          </el-row>
          <el-row class="b-g-f p-10-20 border-style">
            <el-row>
              <div class="dialog__header">
                <span class="dialog__title">报价/预下单</span>
              </div>
            </el-row>
            <el-form ref="quo" :model="quotation" label-width="100px" :rules="rules">
              <el-divider><span class="font-14-bold"></span></el-divider>
              <el-row>
                <el-col :span="12">
                  <el-form-item label="主题:" prop="quotationTheme">
                    <el-input v-model="quotation.quotationTheme" style="width: 79%"></el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item label="转成订单:">
                    <el-radio-group v-model="quotation.quotationStatus">
                      <el-radio :label="1">可见</el-radio>
                      <el-radio :label="2">不可见</el-radio>
                      <el-radio :disabled="true" :label="3">转成订单</el-radio>
                    </el-radio-group>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col>
                  <el-form-item label="客户:" prop="customerByCustomerId.customerName">
                    <el-input :disabled="true" v-model="quotation.customerByCustomerId.customerName" style="width: 91%"></el-input>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="12">
                  <el-form-item label="报价单号:">
                    <el-input :disabled="true" v-model="quotation.quotationNo" style="width: 79%"></el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item label="分类:">
                    <el-select v-model="quotation.quotationClassify" placeholder="未选" style="width: 79%">
                      <el-option v-for="(item,index) in lxOptions" :key="index" :label="item.label" :value="item.value">
                      </el-option>
                    </el-select>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="12">
                  <el-form-item label="日期:">
                    <el-date-picker v-model="quotation.quotationDate" type="date" placeholder="选择日期" style="width: 79%"></el-date-picker>
                  </el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item label="报价:" prop="quotationPrice">
                    <el-input :disabled="true" v-model.number="quotation.quotationPrice" style="width: 79%"></el-input>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col>
                  <el-form-item label="销售机会:">
                    <el-select v-model="quotation.opportunityByOppId" value-key="oppId" placeholder="未选"  style="width: 91%">
                      <el-option v-for="item in opportunityList" :key="item.oppId" :label="item.oppTheme" :value="item">
                      </el-option>
                    </el-select>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col>
                  <el-form-item label="明细:" style="width: 91%">
                    <el-row>
                      <el-col :span="4" :offset="16">
                        <span class="cursor" @click="openPro"><i class="el-icon-edit"></i>编辑明细</span>
                      </el-col>
                      <el-col :span="4">
                        <span @click="printPdf(quotation.quotationId)" class="cursor"><i class="el-icon-printer"></i>打印单据</span>
                      </el-col>
                    </el-row>
                  </el-form-item>
                  <div class="detail">
                    <el-table :data="detailList" style="width: 100%" border show-summary>
                      <el-table-column prop="productByProductId.productName" label="产品名" >
                      </el-table-column>
                      <el-table-column prop="productByProductId.productModel" label="型号" >
                      </el-table-column>
                      <el-table-column prop="productDetailCount" label="数量" >
                      </el-table-column>
                      <el-table-column prop="productDetailPrice" label="单价" >
                        <template slot-scope="scope">
                          ￥{{scope.row.productDetailPrice}}
                        </template>
                      </el-table-column>
                      <el-table-column prop="productDetailMoney" label="金额" >
                        <template slot-scope="scope">
                          ￥{{ (scope.row.productDetailMoney = scope.row.productDetailPrice *scope.row.productDetailCount)}}
                        </template>
                      </el-table-column>
                      <el-table-column prop="productDetailRemarks" label="备注" >
                      </el-table-column>
                    </el-table>
                  </div>
                </el-col>
              </el-row>
              <el-row>
                <el-col>
                  <el-form-item  label="接受人:">
                    <el-select v-model="quotation.quotationContactName"  placeholder="未选" style="width: 91%">
                      <el-option v-for="(item,index) in contactList" :key="index" :label="item.contactName" :value="item.contactName">
                      </el-option>
                    </el-select>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col>
                  <el-form-item label="报价人:" prop="employeeByEmpId.empName">
                    <el-input :disabled="true" v-model="quotation.employeeByEmpId.empName" style="width: 91%">
                      <el-button @click="openEmpDialog" slot="append" icon="el-icon-search"></el-button>
                    </el-input>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col>
                  <el-form-item label="交付说明:">
                    <el-input v-model="quotation.quotationDelivery" type="textarea" :autosize="{ minRows: 2, maxRows: 4}" style="width: 91%"></el-input>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col>
                  <el-form-item label="付款方式:">
                    <el-input v-model="quotation.quotationPayment" type="textarea" :autosize="{ minRows: 2, maxRows: 4}" style="width: 91%"></el-input>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col>
                  <el-form-item label="包装运输说明:">
                    <el-input v-model="quotation.quotationPackage" type="textarea" :autosize="{ minRows: 2, maxRows: 4}" style="width: 91%"></el-input>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col>
                  <el-form-item label="备注:">
                    <el-input v-model="quotation.quotationRemarks" type="textarea" :autosize="{ minRows: 2, maxRows: 4}" style="width: 91%"></el-input>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col>
                  <el-form-item label="审批状态:" style="width: 91%">
                    <div v-if="this.quotation.quotationAppStatus === 0">
                      <span>待申请</span>
                      <el-tooltip class="item" effect="dark" content="待申请" placement="bottom">
                        <i class="el-icon-more font-18"></i>
                      </el-tooltip>
                    </div>
                    <div v-if="this.quotation.quotationAppStatus === 1">
                      <span>待审批</span>
                      <el-tooltip class="item" effect="dark" content="待审批" placement="bottom">
                        <i class="el-icon-s-opportunity font-18"></i>
                      </el-tooltip>
                    </div>
                    <div v-if="this.quotation.quotationAppStatus === 2">
                      <span>同意</span>
                      <el-tooltip class="item" effect="dark" content="同意" placement="bottom">
                        <i class="el-icon-circle-check font-18"></i>
                      </el-tooltip>
                      <span>审批人：{{quotation.employeeByAppEmpId.empName}}</span>
                    </div>
                    <div v-if="this.quotation.quotationAppStatus === 3">
                      <span>否决</span>
                      <el-tooltip class="item" effect="dark" content="否决" placement="bottom">
                        <i class="el-icon-circle-close font-18"></i>
                      </el-tooltip>
                      <span>审批人：{{quotation.employeeByAppEmpId.empName}}</span>
                    </div>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col>
                  <el-form-item label="审批记录:" style="width: 91%">
                    <el-row></el-row>
                    <el-row :key="index" v-for="(app,index) in approvalRecordList">
                      <div class="border-bo" >
                        <div class="font-13-bold">
                          <span>申请：</span>
                          <span class="margin-r-3">{{app.employeeByApplicantEmpId.empName}}<i class="el-icon-right"/> boss用户</span>
                          <span>{{app.approvalRecordDate | formatDateJudge}}</span>
                        </div>
                        <div class="font-13" v-if="app.employeeByApprovalEmpId !== null">
                          <span class="margin-r-3"><i class="el-icon-minus"/>{{app.employeeByApprovalEmpId.empName}}</span>
                          <span class="margin-r-3">{{app.approvalRecordTime | formatDate}}</span>
                          <span class="margin-r-3">{{app.approvalRecordOper}}</span>
                          <span>备注：{{app.approvalRecordNote}}</span>
                        </div>
                      </div>
                    </el-row>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :offset="6">
                  <el-form-item>
                    <span v-if="this.quotation.quotationAppStatus !== 2">
                      <el-button @click="addQuotation" type="primary">保存</el-button>
                      <el-button @click="repealQuo" type="danger">删除</el-button>
                    </span>
                    <span v-if="this.quotation.quotationStatus !== 3">
                        <el-button type="primary" plain @click="repealOrder">生成订单</el-button>
                    </span>
                  </el-form-item>
                </el-col>
              </el-row>
              <!--内层dialog员工-->
              <el-dialog width="30%" title="人员选择" :visible.sync="innerDialogEmp" append-to-body @close="closeInnerDialogEmp">
                <div>
                  <el-collapse v-model="activeName">
                    <el-collapse-item v-for ="(dept,index) in deptList" :title="dept.deptName" :key="index" :name="dept.deptId">
                      <ul class="emp-ul">
                        <li @click="choiceEmp(emp)" v-for="(emp,index) in dept.employeeByDeptId">
                          <span v-if="index !== dept.employeeByDeptId.length-1" class="line-style"></span>
                          <span v-if="index === dept.employeeByDeptId.length-1" class="line-style-end"></span>
                          <span class="">{{emp.empName}}</span>
                        </li>
                      </ul>
                    </el-collapse-item>
                  </el-collapse>
                </div>
              </el-dialog>
            </el-form>
          </el-row>
        </el-col>
        <!--抽屉弹框-->
        <el-drawer title="编辑报价明细" size="60%" :visible.sync="drawer"
                   :direction="'rtl'" @close="closeDrawer" style="font-size:20px">
          <div class="m-l-20 font-18">
            <div class="m-b-10"><span>产品列表</span></div>
            <el-tree :data="proList" @node-click="clickPro" class="m-b-20"
                     node-key="productClassifyId" ref="tree" highlight-current :props="defaultProps">
            </el-tree>
          </div>
          <div class="m-l-20 w-95 font-16">
            <div class="m-b-10"><span>明细表格</span></div>
            <div class="detail">
              <el-table :data="editDetailList" style="width: 100%;margin-top: 10px" border show-summary>
                <el-table-column prop="productByProductId.productName" label="产品名" >
                </el-table-column>
                <el-table-column prop="productByProductId.productModel" label="型号" >
                </el-table-column>
                <el-table-column label="数量" width="150">
                  <template slot-scope="scope">
                    <el-input-number v-model="scope.row.productDetailCount" :min="1" :max="100" size="mini" label="描述文字"></el-input-number>
                  </template>
                </el-table-column>
                <el-table-column prop="productDetailPrice" label="单价" width="150">
                  <template slot-scope="scope">
                    <el-input-number :min="1" v-model="scope.row.productDetailPrice" size="small"></el-input-number>
                  </template>
                </el-table-column>
                <el-table-column prop="productDetailMoney" label="金额" >
                  <template slot-scope="scope">
                    {{ (scope.row.productDetailMoney = scope.row.productDetailPrice *scope.row.productDetailCount)}}
                  </template>
                </el-table-column>
                <el-table-column label="备注" width="150">
                  <template slot-scope="scope">
                    <el-input v-model="scope.row.productDetailRemarks" size="small"></el-input>
                  </template>
                </el-table-column>
                <el-table-column prop="" label="操作" width="60">
                  <template slot-scope="scope">
                    <el-tooltip class="item" effect="dark" content="删除" placement="bottom">
                      <el-button size="mini" @click="deleteDetail(scope.row)"
                                 icon="el-icon-delete" type="danger" circle></el-button>
                    </el-tooltip>
                  </template>
                </el-table-column>
              </el-table>
            </div>
          </div>
          <el-row>
            <el-col class="m-t-20 m-l-20">
              <el-button @click="confirmProList"  type="primary">确认</el-button>
              <el-button @click="drawer = false">取消</el-button>
            </el-col>
          </el-row>
        </el-drawer>
      </el-row>
    </div>
</template>

<script>
  import {formatTimeToStr} from '../assets/format.js'
  export default {
  data () {
    return {
      emp:{},
      contactList: [], // 客户联系人集合
      opportunityList: [],//销售机会集合
      detailList: [],//明细集合
      pageSize: 5, // 分页页大小
      currPage: 1, // 当前页码，默认为1
      totalSize: 0, // 总记录数
      empList:[],// 所有Boss用户
      innerDialog: false,// bossDialog
      innerDialogEmp: false,// 内层dialog员工
      activeName: [],
      deptList:[],
      active: 0, //审批步骤初始值
      // 撤销审批对象
      approval:{
        approvalId:0,
        approvalTheme:'',
        approvalStay:'',
        approvalStatus: '',
        approvalClassify:'',
        approvalOperation:'',
        approvalContent:'',
        approvalDate:'',
        approvalTime:'',
        quotationByQuotationId:'',
        employeeByApplicantEmpId:'',
        employeeByApprovalEmpId:null
      },
      approvalRecordList:[],// 审批记录集合
      // 审批记录
      approvalRecord:{
        approvalRecordId:0,
        approvalRecordTime:'',
        approvalRecordOper:'',
        approvalRecordNote:'',
        approvalRecordDate:'',
        quotationByQuotationId:'',
        employeeByApplicantEmpId:'',
        employeeByApprovalEmpId:null
      },
      // 报价
      quotation: {
        quotationId: 0,
        quotationTheme: '',
        quotationNo: '',
        quotationStatus: '',
        quotationClassify: '',
        quotationDate: '',
        quotationPrice: '',
        quotationDelivery: '',
        quotationPayment: '',
        quotationPackage: '',
        quotationRemarks: '',
        quotationContactName: '',
        quotationAppStatus: 0,
        opportunityByOppId: '',
        customerByCustomerId:{},
        employeeByEmpId:'',
        employeeByAppEmpId:null
      },
      drawer: false, //抽屉
      proList:[],// 所有商品
      pro:{},
      editDetail:{
        productByProductId:'',
        quotationByQuotationId:{},
        productDetailCount: 1,
        productDetailPrice:0,
        productDetailMoney: 0,
        productDetailRemarks: '',
        productDetailOutNum:0
      },
      editDetailList: [],//明细操作集合
      // 树形结构label，children
      defaultProps: {
        label: 'productClassifyName',
        children:'children'
       },
      rules: {
        quotationTheme: [{
          required: true,
          message: '必须填',
          trigger: 'blur'
        }],
        opportunityByOppId : [
          { required: true, message: '请选择机会', trigger: 'change' }
        ],
        'customerByCustomerId.customerName': [
          { required: true, message: '请选择客户', trigger: 'blur' }
        ],
        'employeeByEmpId.empName': [
          { required: true, message: '请选择负责人', trigger: 'blur' }
        ],
        quotationPrice: [
          { required: true, message: '必须填'},
          { type: 'number', message: '必须为数字'}
        ]
      },
      lxOptions: [{
        value: 1,
        label: '证券报价'
      }, {
        value: 2,
        label: '投标报价'
      }, {
        value: 3,
        label: '产品报价'
      }],
      contract: {
        contractId: 0,//合同id
        contractTheme: '', //主题
        opportunityByOppId:'',//销售机会
        customerByCustomerId: '',//对应客户
        employeeByEmpId:'',//所有者
        contractNo:'',  //合同订单号
        contractSort:'',//分类
        contractTotalAmount:0,  //总金额
        contractPaymentMethods:'', //付款方式
        contractStartTime:'',  //下单时间
        contractEndTime:'', //结束时间
        contractCustomerSigner:'',//客户签约人
        contractOurSigner:'', //我方签约人
        contractBackAmount:0,//回款金额
        contractMoneyMethods:'',  //结款方式
        contractStatus: '', //状态
        contractBodyText:'',  //合同正文及附件
        contractNote:'',//备注
        contractAppStatus: 0,
        employeeByAppEmpId:null
      },
      opportunity: {
        oppId: 0,
        oppTheme: '',
        oppUpdateDate: '',
        oppStatus: '',
        oppClassify: '',
        oppFindDate: '',
        oppSource: '',
        oppOffer: '',
        oppNeed: '',
        oppSignDate: '',
        oppPossibility: '',
        oppExpectSum: '',
        oppStage: '',
        oppPriRemark: '',
        oppPriority: '',
        oppContactName: '',
        customerByCustomerId: {},
        employeeByEmpId: {}
      },
      trace: {
        traceId:0,
        traceDate:'',
        traceStage:'',
        tracePrincipal:'',
        traceSignDate:'',
        traceExpectSum:'',
        tracePriRemark:'',
        opportunityByOppId:''
      },
    }
  },
  methods: {
    // 查询当前员工
    loginEmp(){
      this.$axios.get('http://localhost:8088/emp')
        .then(v => {
          this.emp = v.data
        })
        .catch(function (v) {})
    },
    // 查询当前报价
    initData () {
      let quoId = this.$route.query.quoId
      this.$axios.get('http://localhost:8088/emp-quo-id', {
        params: {
          quoId : quoId
        }
      })
        .then(v => {
          this.quotation = v.data
          if(this.quotation.quotationAppStatus === 0){
            this.active = 0
          }else if (this.quotation.quotationAppStatus === 1){
            this.active = 1
          }else if (this.quotation.quotationAppStatus === 2){
            this.active = 2
          }else if (this.quotation.quotationAppStatus === 3){
            this.active = 2
          }
          this.choiceContact()
          this.opportunityData()
          this.findOpportunity(this.quotation.opportunityByOppId.oppId)
        })
        .catch(function (v) {})
    },
    // 查询客户所有机会
    opportunityData () {
      this.$axios.get('http://localhost:8088/cus-opp-list-all', {
        params:{
          cusId : this.quotation.customerByCustomerId.customerId
        }
      })
        .then(v => {
          this.opportunityList = v.data
        })
        .catch(function (v) {})
    },
    // 选择联系人
    choiceContact(){
      this.$axios.get('http://localhost:8088/contact-list', {
        params: {
          customerId : this.quotation.customerByCustomerId.customerId
        }
      })
        .then(v => {
          this.contactList = v.data
        })
        .catch(function (v) {})
    },
    // 查询产品集合
    findProduct(){
      this.$axios.get('http://localhost:8088/pro-classify-list')
        .then(v => {
          this.proList = v.data
        })
        .catch(function (v) {})
    },
    // 查询详单集合
    findDetail(){
      let quoId = this.$route.query.quoId
      this.$axios.get('http://localhost:8088/quo-detail-list', {
        params:{
          quoId : quoId
        }
      })
        .then(v => {
          this.detailList = v.data
          this.editDetailList = this.detailList
        })
        .catch(function (v) {})
    },
    // 查询报价单待审批表
    findApproval(){
      let quoId = this.$route.query.quoId
      this.$axios.get('http://localhost:8088/app-quo', {
        params:{
          quoId : quoId
        }
      })
        .then(v => {
          if (v.data.length !== 0 ){
            this.approval = v.data
          }
        })
        .catch(function (v) {})
    },
    // 查询报价处于待审批状态的审批记录
    findAppRecordBy(){
      let quoId = this.$route.query.quoId
      this.$axios.get('http://localhost:8088/app-record-quo-app', {
        params:{
          quoId : quoId
        }
      })
        .then(v => {
          if (v.data.length !== 0 ){
            this.approvalRecord = v.data
          }
        })
        .catch(function (v) {})
    },
    // 查询报价单审批记录表
    findAppRecord(){
      let quoId = this.$route.query.quoId
      this.$axios.get('http://localhost:8088/app-record-quo-list', {
        params:{
          quoId : quoId
        }
      })
        .then(v => {
            this.approvalRecordList = v.data
        })
        .catch(function (v) {})
    },
    // 查询所有boss
    findAllEmp(currPage,pageSize){
      this.innerDialog = true
      this.$axios.get('http://localhost:8088/emp-boss-list',{params: {
          page: currPage,
          size: pageSize,
        }
      })
        .then(v => {
          this.empList = v.data.rows
          this.totalSize = v.data.total
        })
        .catch(function (v) {})
    },
    //boss分页
    changePage (val) {
      // val就是当前页码
      this.findAllEmp(val, this.pageSize)
    },
    //打开选择产品抽屉
    openPro(){
      if (this.quotation.quotationAppStatus === 2){
        this.$message({
          message: '该采购单审核通过，不可编辑明细',
          type: 'warning'
        });
      }else {
        this.drawer = true
        this.findProduct()
        this.editDetailList = this.detailList
      }
    },
    // 点击选择产品
    clickPro(d,v,e){
      if(d.children.length == 0){
        this.$axios.get('http://localhost:8088/pro-id', {
          params: {
            proId : d.productClassifyId
          }
        })
          .then(v => {
            this.pro = v.data
            if (this.editDetailList.length ===0){
              this.addDetailList()
            }else {
              if (this.isDetailList() === true){
                this.$message('您添加的产品在列表中已经存在了！');
              }else {
                this.addDetailList()
              }
            }
          })
          .catch(function (v) {})
      }
    },
    // 将选择产品放过编辑明细集合
    addDetailList(){
      this.editDetail.productByProductId = this.pro.productsByProductClassifyId[0]
      this.editDetail.productDetailPrice = this.pro.productsByProductClassifyId[0].productPrice
      this.editDetail.productDetailOutNum = 0
      this.editDetailList.push(this.editDetail)
      this.editDetail = {
        productByProductId:'',
        quotationByQuotationId:{},
        productDetailCount: 1,
        productDetailPrice:0,
        productDetailMoney: 0,
        productDetailRemarks: '',
        productDetailOutNum:0
      }
    },
    // 判断所选商品是否重复
    isDetailList(){
      let num = 0
      this.editDetailList.forEach(v=>{
        if (v.productByProductId.productId == this.pro.productsByProductClassifyId[0].productId){
          console.log("重复")
          num = 1;
        }
      })
      if (num == 1){
        return true
      }else {
        return false
      }
    },
    // 从详单删除商品
    deleteDetail(val){
      let index=0;
      for(let i = 0; i < this.editDetailList.length; i++){
        if(this.editDetailList[i].productByProductId.productId === val.productByProductId.productId){
          index = i;
          break;
        }
      }
      this.editDetailList.splice(index,1)
    },
    // 确认详单，关掉抽屉
    confirmProList(){
      this.drawer = false
      this.detailList = this.editDetailList
      this.quotation.quotationPrice = this.quotationPrice
      this.addQuotation()
    },
    //关闭抽屉实践
    closeDrawer(){
      this.quotation.quotationPrice = this.quotationPrice
    },
    //查询部门员工
    findDeptList () {
      this.$axios.get('http://localhost:8088/dept-emp-list')
        .then(v => {
          this.deptList = v.data
          for(let i = 1;i <= this.deptList.length;i++){
            this.activeName.push(i)
          }
        })
        .catch(function (v) {})
    },
    //打开员工dialog
    openEmpDialog(){
      this.innerDialogEmp = true
      this.findDeptList()
    },
    // 选择员工
    choiceEmp(val) {
      this.quotation.employeeByEmpId = val
      this.innerDialogEmp = false;
    },
    //关闭员工diglog事件
    closeInnerDialogEmp(){
      this.activeName = []
    },
    // 修改报价单
    addQuotation () {
      this.$refs.quo.validate((valid) => {
        if (valid) {
          this.$axios.post('http://localhost:8088/save-quotation',
            {
              quotationId: this.quotation.quotationId,
              quotationTheme: this.quotation.quotationTheme,
              quotationNo: this.quotation.quotationNo,
              quotationStatus: this.quotation.quotationStatus,
              quotationClassify: this.quotation.quotationClassify,
              quotationDate: this.quotation.quotationDate,
              quotationPrice: this.quotation.quotationPrice,
              quotationDelivery: this.quotation.quotationDelivery,
              quotationPayment: this.quotation.quotationPayment,
              quotationPackage: this.quotation.quotationPackage,
              quotationRemarks: this.quotation.quotationRemarks,
              quotationContactName: this.quotation.quotationContactName,
              employeeByEmpId: this.quotation.employeeByEmpId,
              quotationAppStatus: this.quotation.quotationAppStatus,
              employeeByAppEmpId: this.quotation.employeeByAppEmpId,
              opportunity: this.quotation.opportunityByOppId,
              customerByCustomerId: this.quotation.customerByCustomerId,
              details: this.detailList
            })
            .then(v => {
              // 1、刷新数据
              this.initData()
              this.findDetail()
              this.findApproval()
              this.findAppRecord()
              this.findAppRecordBy()
              this.$message({
                message: '已保存',
                type: 'success'
              });
            })
            .catch(function (v) {
            })
        } else {
          console.log('error submit!!');
          return false;
        }
      })
    },
    //删除提示
    repealQuo(){
      this.$confirm('此操作将删除报价, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.deleteQuotation()
        this.$message({
          type: 'success',
          message: '删除成功!'
        });
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消删除'
        })
      })
    },
    // 删除
    deleteQuotation () {
      let quoId = this.$route.query.quoId
      this.$axios.post('http://localhost:8088/delete-quotation', this.qs.stringify({quoId: quoId}))
        .then(v => {
          this.$router.push('/quotation');
        })
        .catch(function (v) {})
    },
    // 申请审批
    saveApproval(){
      //新增审批记录表
      this.approvalRecord.employeeByApplicantEmpId = this.emp
      this.approvalRecord.approvalRecordDate = this.addDate()
      this.approvalRecord.quotationByQuotationId = this.quotation
      this.saveAppRecord()
      //新增审批表 审批状态1 1待审批 2同意 3否决 4撤销
      this.approval.approvalTheme = this.quotation.quotationTheme
      this.approval.approvalContent = '报价记录'
      this.approval.approvalStatus = 1
      this.approval.approvalDate = this.addDate()
      this.approval.approvalClassify = 2
      this.approval.employeeByApplicantEmpId = this.emp
      this.approval.quotationByQuotationId = this.quotation
      this.saveApp()
      this.$message({
        message: '申请成功',
        type: 'success'
      })
      //修改报价单 审批状态为待审批 0待申请 1待审批 2同意 3否决
      this.quotation.quotationAppStatus = 1
      this.addQuotation ()
    },
    //撤销审批提示
    repealApp(){
      this.$confirm('此操作将撤销审批, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.updateApproval()
        this.$message({
          type: 'success',
          message: '撤销成功!'
        });
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消撤销'
        })
      })
    },
    //撤销审批
    updateApproval(){
      //修改审批记录表
      this.approvalRecord.approvalRecordTime = '1'
      this.approvalRecord.approvalRecordOper = '撤销'
      this.approvalRecord.employeeByApprovalEmpId = this.emp
      this.saveAppRecord()
      //修改审批表 审批状态1 1待审批 2同意 3否决 4撤销 5重审
      this.approval.approvalStatus = 4
      this.saveApp()
      //修改报价单 审批状态为待申请  0待申请 1待审批 2同意 3否决
      this.quotation.quotationAppStatus = 0
      this.addQuotation ()
    },
    // 审批axois
    saveApp(){
      console.log(this.approval.approvalId)
      this.$axios.post('http://localhost:8088/save-approval',
        {
          approvalId:this.approval.approvalId,
          approvalContent:this.approval.approvalContent,
          approvalTheme:this.approval.approvalTheme,
          approvalStay:this.approval.approvalStay,
          approvalStatus: this.approval.approvalStatus,
          approvalClassify:this.approval.approvalClassify,
          approvalOperation:this.approval.approvalOperation,
          approvalDate:this.approval.approvalDate,
          approvalTime:this.approval.approvalTime,
          employeeByApplicantEmpId:this.approval.employeeByApplicantEmpId,
          employeeByApprovalEmpId:this.approval.employeeByApprovalEmpId,
          quotationByQuotationId:this.approval.quotationByQuotationId
        })
        .then(v => {
          this.innerDialog = false
          this.approval = {
            approvalId:0,
            approvalTheme:'',
            approvalStay:'',
            approvalStatus: 0,
            approvalClassify:0,
            approvalOperation:'',
            approvalDate:'',
            approvalTime:'',
            quotationByQuotationId:'',
            employeeByApplicantEmpId:'',
            employeeByApprovalEmpId:null
          }
        })
        .catch(function (v) {})
    },
    // 审批记录axois
    saveAppRecord(){
      this.$axios.post('http://localhost:8088/save-app-record',
        {
          approvalRecordId:this.approvalRecord.approvalRecordId,
          approvalRecordOper:this.approvalRecord.approvalRecordOper,
          approvalRecordNote:this.approvalRecord.approvalRecordNote,
          employeeByApprovalEmpId:this.approvalRecord.employeeByApprovalEmpId,
          employeeByApplicantEmpId:this.approvalRecord.employeeByApplicantEmpId,
          approvalRecordDate:this.approvalRecord.approvalRecordDate,
          approvalRecordTime:this.approvalRecord.approvalRecordTime,
          quotationByQuotationId: this.approvalRecord.quotationByQuotationId
        })
        .then(v => {
          this.approvalRecord = {
            approvalRecordId:0,
            approvalRecordTime:'',
            approvalRecordOper:'',
            approvalRecordNote:'',
            employeeByApplicantEmpId:'',
            employeeByApprovalEmpId:null,
            approvalRecordDate:'',
            quotationByQuotationId:''
          }
      })
        .catch(function (v) {})
    },
    // 查询机会
    findOpportunity (oppId) {
      this.$axios.get('http://localhost:8088/emp-opp-id', {
        params: {
          oppId : oppId
        }
      })
        .then(v => {
          this.opportunity = v.data
        })
        .catch(function (v) {})
    },
    //生成订单提示
    repealOrder(){
      if (this.quotation.quotationAppStatus === 2){
        this.$confirm('此操作将生成订单, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          this.saveOrderJudge()
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消生成'
          })
        })
      }else {
        this.$message({
          type: 'info',
          message: '当前报价单未审批通过，不允许转成订单。'
        })
      }
    },
    // 生成合同订单操作
    saveOrderJudge(){
      // 修改机会
      this.addOpportunity()
      // 修改报价
      this.quotation.quotationStatus = 3
      this.addQuotation()
      // 生成合同
      this.saveOrder()
    },
    // 合同订单axais
    saveOrder(){
      this.$axios.post('http://localhost:8088/save-contract',
        {
          contractId:0,
          contractTheme:'订单:'+this.quotation.quotationTheme,
          contractNo:this.contractNo(),
          contractTotalAmount:this.quotation.quotationPrice,
          contractStartTime:this.addDate(),
          contractBackAmount:0,
          contractStatus:1,
          contractAppStatus: 0,
          customerByCustomerId:this.quotation.customerByCustomerId,
          opportunity: this.quotation.opportunityByOppId,
          employeeByEmpId:this.quotation.employeeByEmpId,
          details:this.detailList
        })
        .then(v => {
          this.$router.push({path: '/contractview', query: {contractId: v.data}});
          this.$message({
            message: '请补全合同订单信息',
            type: 'success'
          });
        })
        .catch(function (v) {})

    },
    // 修改机会
    addOpportunity () {
      // 状态
      this.opportunity.oppStatus = 2
      this.opportunity.oppStage = 7
      this.opportunity.oppPossibility = 11
      this.opportunity.oppUpdateDate = this.addDate()
      this.saveTrace()
      this.$axios.post('http://localhost:8088/save-opportunity',this.opportunity)
        .then(v => {
        })
        .catch(function (v) {})
    },
    // 新增跟踪日志
    saveTrace(){
      this.trace.traceDate = this.addDate()
      this.trace.traceStage = '合同签约'
      this.trace.tracePrincipal = '100%'
      this.trace.traceSignDate = this.opportunity.oppSignDate
      this.trace.traceExpectSum = this.opportunity.oppExpectSum
      this.trace.tracePriRemark = this.emp.empName+'--生成合同订单'
      this.trace.opportunityByOppId = this.opportunity
      this.$axios.post('http://localhost:8088/save-trace',this.trace)
        .then(v => {
        })
        .catch(function (v) {})
    },
    // 合同订单号
    contractNo() {
      var contractNo = "";
      for (var i = 0; i < 4; i++) //j位随机数，用以加在时间戳后面。
      {
        contractNo += Math.floor(Math.random() * 10);
      }
      contractNo = 'HT' + this.addDateNum() + contractNo;
      return contractNo;
    },
    // 获取当前日期20200206
    addDateNum () {
      var date = new Date();
      var year = date.getFullYear();
      var month = date.getMonth() + 1;
      var strDate = date.getDate();
      if (month >= 1 && month <= 9) {
        month = "0" + month;
      }
      if (strDate >= 0 && strDate <= 9) {
        strDate = "0" + strDate;
      }
      var currentdate = year  + month  + strDate;
      return currentdate;
    },
    // 获取当前日期
    addDate () {
      var date = new Date();
      var seperator1 = "-";
      var seperator2 = ":";
      var month = date.getMonth() + 1<10? "0"+(date.getMonth() + 1):date.getMonth() + 1;
      var strDate = date.getDate()<10? "0" + date.getDate():date.getDate();
      var currentdate = date.getFullYear() + seperator1  + month  + seperator1  + strDate
      return currentdate
    },
    // 导出PDF
    printPdf(val){
      this.$router.push({path: '/printquotation', query: {quoId: val}});
    },
  },
  computed:{
    quotationPrice(){
      var total = 0;
      this.editDetailList.forEach(p=>{
        var number = p.productDetailCount===undefined?0:parseFloat(p.productDetailCount);
        total +=  number* parseFloat(p.productDetailPrice);
      });
      return total;
    }
  },
  created() {
    this.loginEmp()
    this.initData()
    this.findDetail()
    this.findApproval()
    this.findAppRecord()
    this.findAppRecordBy()
  },
    filters: {
      formatDate: function(time) {
        if(time!=null&&time!="")
        {
          var date = new Date(time);
          return formatTimeToStr(date, "yyyy-MM-dd hh:mm");
        }else{
          return "";
        }
      },
      formatDateJudge: function(time) {
        if(time != null && time != "")
        {
          let date = new Date(time);
          let currentDate = new Date()
          let seperator1 = "-";
          let month = currentDate.getMonth() + 1<10? "0"+(currentDate.getMonth() + 1):currentDate.getMonth() + 1;
          let strDate = currentDate.getDate()<10? "0" + currentDate.getDate():currentDate.getDate();
          let today = currentDate.getFullYear() + seperator1  + month  + seperator1  + strDate
          let todayTime = new Date(today)
          let yesterday = todayTime.setDate(todayTime.getDate() - 1)
          let beforeYesterday = todayTime.setDate(todayTime.getDate() - 1)
          let tomorrow = todayTime.setDate(todayTime.getDate() + 3)
          let afterTomorrow = todayTime.setDate(todayTime.getDate() + 1)
          todayTime.setDate(todayTime.getDate() - 2)
          if (date.getTime() === todayTime.getTime()){
            return '今天'
          }else if (date.getTime() ===  yesterday){
            return '昨天'
          }else if (date.getTime() ===  beforeYesterday){
            return '前天'
          }else if (date.getTime() ===  tomorrow){
            return '明天'
          }else if (date.getTime() ===  afterTomorrow){
            return '后天'
          }else {
            return time
          }
        }else{
          return "";
        }
      }
    }
}
</script>

<style scoped>

</style>
